<div class="modal-header"
     xmlns:th="http://www.thymeleaf.org">
    <button aria-label="Close" class="close" data-dismiss="modal" type="button">
        <span aria-hidden="true">×</span></button>
    <h4 class="modal-title" th:text="|角色权限 (${role.name})|">角色权限</h4>
</div>
<div class="modal-body"
     xmlns:th="http://www.thymeleaf.org">
    <div class="row">
        <div class="col-xs-12">
            <table id="js-tree-table" class="table no-m">
                <thead>
                <tr>
                    <th class="col-md-2 pd-l-lg">
                        <span class="pd-l-sm ml20"></span>菜单名称
                    </th>
                    <th class="col-md-2">URL</th>
                    <th class="col-md-1">权限类型</th>
                    <th class="col-md-2">权限标识</th>
                </tr>
                </thead>
                <tbody>
                <th:block th:each="permission, i:${role.permissions}">
                    <tr th:attr="data-tt-id=${permission.id}, data-tt-parent-id=${permission.parent}, data-tt-branch=${permission.hasChildren}">
                        <td th:text="${permission.name}"></td>
                        <td th:text="${permission.url}"></td>
                        <td th:text="${permission.type(permission.type)}"></td>
                        <td th:text="${permission.permission}"></td>
                    </tr>
                </th:block>
                </tbody>
            </table>
        </div>
    </div>
</div>
<script>
    $(function () {
        $("#js-tree-table").treetable({
            expandable: true
        });
    });
</script>